<template>
  <div class="app-container">
    <!-- 有 token 时显示布局组件，否则直接显示路由内容 -->
    <Layout v-if="hasToken">
      <router-view></router-view>
    </Layout>
    <router-view v-else></router-view>
  </div>
</template>

<script setup>
import { computed } from 'vue'
import { useStore } from 'vuex'
import Layout from './components/Layout.vue'

const store = useStore()
const hasToken = computed(() => !!store.state.user.token)
</script>

<style>
.app-container {
  height: 100vh;
}

/* 重置一些基础样式 */
html, body {
  margin: 0;
  padding: 0;
  height: 100%;
}

</style>
